
import { LockOutlined, UserOutlined } from '@ant-design/icons';
import { Button, Form, Input } from 'antd';
import { loginapi } from '../../request/api';
import { useNavigate } from 'react-router-dom';

function Index() {
    const nav = useNavigate()
    const onFinish = (values: { username: string, password: string }) => {
        console.log('Received values of form: ', values);
        // 调用登录接口
        loginapi(values).then(res => {
            console.log('login', res)
            if (res.data.code == 10000) {
                localStorage.setItem('refreshToken', res.data.data.refreshToken)
                localStorage.setItem('token', res.data.data.accessToken)
                nav('/')
            }
        })
    };
    return (
        <div>
            <h1>登录</h1>
            <Form
                name="login"
                initialValues={{ remember: true }}
                style={{ maxWidth: 360 }}
                onFinish={onFinish}
            >
                <Form.Item
                    name="username"
                    rules={[{ required: true, message: 'Please input your Username!' }]}
                >
                    <Input prefix={<UserOutlined />} placeholder="Username" />
                </Form.Item>
                <Form.Item
                    name="password"
                    rules={[{ required: true, message: 'Please input your Password!' }]}
                >
                    <Input prefix={<LockOutlined />} type="password" placeholder="Password" />
                </Form.Item>


                <Form.Item>
                    <Button block type="primary" htmlType="submit">
                        登录
                    </Button>

                </Form.Item>
            </Form>
        </div>
    )
}

export default Index
